<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
<style>
    .material-icons{
    color: #03a9f4;
        font-size: 50px;
    }
  .badge{
    position: relative;
    width: 50px;
    height: 50px;
  }
.badge-wrapper{
  width: 20px;
  height: 20px;
  color: white;
  background: red;
  border-radius: 15px;
  position: absolute;
  right: 0px;
  top: 0px;
  border: 3px solid white;
}
.badge-content{
}
</style>
<body>
<div class="badge">
  <div class="badge-content">
    <i class="material-icons ">bug_report</i>
  </div>
  <div class="badge-wrapper">
    12
  </div>
</div>
</body>
</html>